<template>
	<view class="container page">
		<!-- <view class="header-top mar-t-10">
			<view class="font-color-fff text-middle tq-text-line1">
				<text class="font-size-15">预约咨询师：</text>
				<text class="font-size-16">张向</text>
			</view>
			<view class="font-color-fff text-middle tq-text-line1 mar-t-20">
				<text class="font-size-15">预约时间：</text>
				<text class="font-size-16">2020-1-20</text>
			</view>
		</view> -->
		<view class="pj-card pad-t-15 pad-b-20 mar-t-20">
			<view class="pt-top flex text-middle align-center">
				<view class="font-size-16 font-bold font-color-9b">
					<text>综合评分</text>
				</view>
				<view class="flex-1 pj-rate">
					<htz-rate v-model="score_info.zhpf"></htz-rate>
				</view>
			</view>
			<view class="pt-top flex text-middle align-center mar-t-10">
				<view class="font-size-16 font-bold font-color-9b">
					<text>服务评分</text>
				</view>
				<view class="flex-1 pj-rate">
					<htz-rate v-model="score_info.fwpf"></htz-rate>
				</view>
			</view>
			<view class="pt-top flex text-middle align-center mar-t-10">
				<view class="font-size-16 font-bold font-color-9b">
					<text>帮助评分</text>
				</view>
				<view class="flex-1 pj-rate">
					<htz-rate v-model="score_info.bzpf"></htz-rate>
				</view>
			</view>

			<view class="remark mar-t-30 font-size-16">
				<textarea placeholder-style="color:#888;" placeholder="请输入评价内容..." v-model="remark" />
			</view>
		</view>
		<!-- <view class="pos-rel">
			<view class="pos-abs" style="right:0;top:15px">
				<switch checked @change="switch1Change" size="14" style="height:10px" />
				<text>匿名</text>
			</view>
		</view>-->
		<view class="footer" @click="sub">确认提交</view>
	</view>
</template>

<script>
import htzRate from '@/components/htz-rate'
import { evaluateCreate } from '@/utils/http'
export default {
	data() {
		return {
			order_no: '',
			score_info: { zhpf: 0, fwpf: 0, bzpf: 0 },
			remark: ''
		}
	},
	components: {
		htzRate
	},
	methods: {
		sub() {
			const _that = this
			evaluateCreate({
				type: 'activity_log',
				order_no: this.order_no,
				score_info: JSON.stringify(this.score_info),
				remark: this.remark
			}).then(res => {
				if (res) {
					this.successToShow('评价成功', function() {
						_that.redirect('/pages/order/index')
					})
				}
			})
		}
	},
	onLoad(options) {
		this.type = options.type
		this.order_no = options.order_no
	}
}
</script>

<style scoped>
.header-top {
	padding: 12px 20px;
	background-color: #376eff;
	border-radius: 9px;
}
.pj-card {
	padding-left: 20px;
	padding-right: 20px;
	box-shadow: 1px 2px 5px 1px rgba(241, 237, 237, 0.884);
}
.pj-card .pj-rate {
	margin-left: 30px;
}
.remark textarea {
	width: auto !important;
	padding: 15px 8px;
	border: 1px solid #bbbbbb;
	border-radius: 5px;
}
.footer {
	margin: 0 auto;
	margin-top: 60px;
	border-radius: 8px;
	height: 46px;
	line-height: 46px;
	font-size: 18px;
	color: #fff;
	width: 230px;
	background-color: #376eff;
	text-align: center;
}
</style>